 <template>
  <div>
     <van-row class="login">
      <van-col span="12" offset="6"
        ><img :src="logo" alt="" class="logo"
      /></van-col>
      <van-col span="20" offset="2">
        <input type="text" placeholder="手机号" v-model="user.phone" />
        <input type="text" placeholder="昵称" v-model="user.nickname" />
         <input type="text" placeholder="密码" v-model="user.password" />
        <van-button type="primary" class="log" @click="reg()">注册</van-button>
      </van-col>
    </van-row>
  </div> 
</template>

<script>
import {reqRegsiter} from "../../http/http"
import logo from "../../assets/img/logo.png";
import { Toast } from 'vant';
export default {
  data() {
    return {
      logo,
      user: {
        phone: "",
        nickname: "",
        password: "",
      },
    };
  },
  methods: {
    reg() {
     reqRegsiter(this.user).then((res) => {
        if(res.data.code==200){
          Toast(res.data.msg)
          this.$router.push("/login")
        }
      });
    },
  },
};
</script>

<style scoped lang="less">
@import "../../less/index.less";
.login {
  margin-top: 10vh;
}
.login img {
  width: 100%;
}
.login .logo {
  margin-top: 10vh;
  margin-bottom: 10vh;
}
input {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
}
.login input {
  width: 100% !important;
  width: 6.1rem;
  height: 0.68rem;
  font-size: 0.24rem;
  vertical-align: bottom;
  border-bottom: 0.02rem solid #ccc;
}
.log {
  margin-top: @margin_bottom;
  margin-bottom: @margin_bottom;
  width: 100%;
  background: @primary;
  border: none;
}
</style>
